<template>
  <div id="app">
    <!-- <Layout v-if="!($route.meta || {}).noLayout" /> -->
    <router-view />
  </div>
</template>
<script>
// import { Layout } from "@rabbit.do/rabbit";

export default {
  name: 'App',
  data() {
    return {
      activeDate: 0,
    };
  },
  watch: {
    $route: {
      handler(val, oldVal) {
        // this.activeDate = new Date().valueOf();
        // const lable = document.getElementsByClassName("el-table__header");
        // console.log(lable, lable[0]);
        // if (lable.length > 0) {
        //   const width = lable[0].clientWidth;
        //   console.log(lable, width, '1111');
        // }
      },
      deep: true,
    },
  },
  // components: { Layout },
  // mounted() {

  // },
};
</script>

<style lang="scss">
#app{
  font-size: 12px;
}
.el-dialog__body{
  font-size: 12px!important;
}
.el-picker-panel {
  /deep/.el-time-panel {
    left: -22px !important;
  }
}
.search .el-input__inner {
  padding-right: 56px !important;
}
.add {
  float: right;
}
.submit {
  width: 186px;
  height: 30px;
  font-size: 14px;
  background: #71c9ce !important;
  border: 1px solid #71c9ce !important;
  border-radius: 10px;
  transform: translateX(50%);
  // margin-left: -93px !important;
}
ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.twoButton {
  display: flex;
  .el-button{
    font-size: 14px;
    width: 100%;
    justify-content: center;
    background: #71c9ce !important;
    border: 1px solid #71c9ce !important;
    border-radius: 10px;
  }
}
// 表格隔行变色
.el-table .warning-row {
  background: #ffffff;
  line-height: 31px !important;
}
.el-table .success-row {
  background: #F2F2F2;
  line-height: 31px !important;
}
// 分页器
.el-pagination{
  float: left !important;
}
.pagination-container{
  margin-left: 19px;
  padding-bottom: 20px;
}
// 日期选择器的样式
.el-date-picker-y{
  width: 178px;
  height: 30px;
  border: 1px solid #D3DFF7 !important;
  border-radius: 2px;
}
// 下拉框的样式
.el-select-y{
  /deep/.el-input__inner,.el-select-y{
    border: 1px solid #D3DFF7 !important;
    border-radius: 2px;
    font-size: 12px;
  }
  /deep/.el-icon-arrow-up:before{
    color: #0278DC;
  }
  .el-input__suffix{
    background: #eff3fb;
    width: 30px;
    height: 31px;
    border-top: 1px solid #D3DFF7;
    transform: translateX(4px);
  }
}
.el-select-dropdown .el-scrollbar,.el-picker-panel__body{
  border: 1px solid #D3DFF7;
  // background: #000;
  border-radius: 2px;
  .el-select-dropdown__item:hover{
      background: #EFF3FB;
  }
  .el-select-dropdown__item.hover:before, .el-select-dropdown__item:hover:before{
    background: none;
    color: #333333;
  }
  .el-select-dropdown__item.hover:before, .el-select-dropdown__item:hover:before{
    background: none;
    color: #333333;
  }
}
.el-select-dropdown .el-popper{
  border: 1px solid #D3DFF7;
}
// /deep/.el-popper[x-placement^=bottom] .popper__arrow,/deep/.el-popper[x-placement^=bottom].popper__arrow::after{
//   border: 1px solid #D3DFF7;
// }
// form表单中的样式
.el-form-item__content .el-input__inner{
  border: 1px solid #D3DFF7;
}
.el-form-item__content .el-input__inner:hover{
  border: 1px solid #D3DFF7;
}
.el-form-item__content .el-input__inner:focus{
  border: 1px solid #9baed3;
}
.el-radio__inner{
  border: 1px solid #9baed3 !important;
}
// 比如咨询情况这种的样式
.box-y{
  border: 1px solid #D3DFF7;
  // min-height: 90px;
  padding: 5px;
  width: 100%;
  height: 120px;
  overflow-y: auto;
}
.el-switch.is-checked .el-switch__core{
  background: #a9c2f3 !important;
  border: 1px solid #D3DFF7 !important;
}
// 表格不换行，超出省略号显示
.el-table .cell {
  white-space: nowrap;   //强制不换行
  overflow: hidden; //溢出隐藏
  text-overflow: ellipsis  //替换为省略号
}
style{
  font-family: 'Microsoft Yahei';
}
// 顶部的增加顾客等按钮的样式
.buttons .el-button{
  width: 84px;
  height: 30px;
  background: #EFF3FB !important;
  border-radius: 2px;
  font-size: 14px;
  font-weight: 500;
  padding: 0;
  text-align: center;
  color: #0278DC !important;
  border: none;
}
// 下拉框删除图片改变颜色
.el-icon-circle-close.el-select__caret.el-input__icon{
  color: #9baed3 !important;
}
// 输入框获取焦点时的边框颜色
.el-form-item__content .el-input__inner:focus{
  border: 1px solid #D3DFF7
}

.searchs-y{
  .info-title {
    margin: 20px 0;
  }
  .el-input{
    width: 370px;
    height: 47px;
    background: #EFF3FB;
    border-radius: 13px;
    /deep/.el-input__inner{
      width: 370px;
      height: 47px;
      background: #EFF3FB;
      border-radius: 13px 0 0 13px;
      border: none;
      font-size: 12px;
      font-weight: 400;
      color: #333;
      line-height: 31px;
    }
    /deep/.el-input__inner::placeholder {
      color: #CCCCCC;
    }
    /deep/.el-input-group__append{
      border: none;
      width: 48px;
      height: 47px;
      background: rgba(211,223,247,0.7);
      border-radius: 14px;
      /deep/.el-icon-search:before{
        color: #3B72E2;
        font-size: 16px;
        font-weight: 700;
      }
    }
  }
}
.float-l{
  .clearfix{
    display: inline-block !important;
  }
  >div{
    float: left;
  }
  .el-form-item.el-form-item--small,.dictSelector,.el-select--small.el-select-y{
    margin-left: 10px;
    margin-right: 10px;
    .el-form-item.el-form-item--small{
      width: 10% !important;
    }
  }
  .el-form-item.el-form-item--small{
    margin-left: 0 !important;
  }

}

// 多选项的边框
.el-checkbox__inner{
  border: 1px solid #D3DFF7 !important;
}
// 表格内字体大小
.el-table__body tr, .el-table__body td{
  font-size: 12px;
}
// 分页组件样式
.pagination-container .el-pagination .btn-next, .pagination-container .el-pagination .btn-prev, .pagination-container .el-pagination .el-pager li, .pagination-container .el-pagination.is-background .btn-next, .pagination-container .el-pagination.is-background .btn-prev, .pagination-container .el-pagination.is-background .el-pager li{
  border-color: #D3DFF7 !important;
}
.el-input__inner{
border-color: #D3DFF7 !important;
}

.fl,.mr10{
  margin-right: 0 !important;
}
// 弹窗样式
.el-dialog__body{
  padding: 30px 70px 30px 50px !important;
}
.el-dialog__footer{
  padding: 0 0 30px 0 !important;
  margin-top: 30px;
}
// 两列弹窗
.two-columns .el-dialog{
  width: 800px !important;
  .el-radio__label{
  font-size: 12px;
}
.el-checkbox__label{
  font-size: 12px;
}
}
// 单列弹窗
.single-column .el-dialog{
  width: 455px !important;
  min-width: 455px !important;
}
// 开单弹窗
.wide-popup .el-dialog{
  width: 1000px !important;
}
.el-tabs__item{
  font-size: 12px!important;
}
.el-tree-node__label{
  font-size: 12px!important;
}
.el-aside{
  background: #fff !important;
  padding: 0 !important;
}
.el-tabs__nav-wrap::after{
  height: 0 !important;
}
.el-main{
  padding: 0 20px 20px 20px !important;
}
.el-table .cell, .el-table--border td:first-child .cell, .el-table--border th:first-child .cell{
  padding-left: 10px !important;
}
.el-tabs__item{
  padding: 0 10px !important;
}
// .el-input-number--small .el-input-number__decrease, .el-input-number--small .el-input-number__increase{
//   width: 24px !important;
// }
// .el-input-number--small{
//   width: 110px !important;
//   line-height: 23px !important;
// }
// .el-input--small .el-input__inner{
//   height: 25px !important;
//   line-height: 25px !important;
// }
// .el-input-number__decrease, .el-input-number__increase{
//   color:#000 !important;
// }
// 页面切换组件样式
.money-flowing .el-tabs__header{
  margin-left: 0 !important;
  margin: 0 0 10px
}
.money-flowing .el-tabs__item{
  width: 76px !important;
  flex: 0 !important;
}
//main-container全局样式
.app-container {
  height: calc(100vh - 100px) !important;
  //min-height: 100%;
  //min-height: calc(100vh - 90px - 48px); // 90: header高度 48 main-container padding
  //padding: 24px 32px;
  //border-radius: $main-border-radius;
  //background: #fff;
}

.float-l .clearfix{
  height: 32px !important;
}
.font-size-14-y{
  font-size: 14px !important;
}
.font-size-12-y{
  font-size: 12px !important;
}

.bg[data-v-e8e1da74],
.bg[data-v-2f0119fe]{
  height: 25px !important;
  margin-top: 10px !important;
  line-height: 8px !important;
}

.el-dialog__body{
  padding: 30px 70px 0 50px !important;
}
// .el-table .cell{
//   height: 23px;
// }
.setUp{
.el-table .cell{
  height: 32px !important;
}
}
// .dialogStyle .el-form .el-form-item .el-form-item__content{
//   width: 237.5px !important;
// }
.scheduling{
  .el-dialog{
    width: 1395px !important;
  }
}
.ProseMirror p{
  font-size: 12px;
}
.all-margin-bottom{
  margin-bottom: 30px;
}
</style>
